import React, { PureComponent } from 'react';
import { Form, Row, Col, Cascader, DatePicker, Input, Select } from 'antd';
import moment from 'moment';
import { DEFAULT_RESPONE_SUCCESS, DEFAULT_VALID_STATE } from '@/constants';

import List from '@/pages/Emergency';

const { TextArea } = Input;
const { Option } = Select;
const { RangePicker } = DatePicker;

export default class Index extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      selectedEvents: []
    }
  }

  componentDidMount() {
  }

  render() {
    const { selectedEvents = [] } = this.state;
    const { form, data = {}, disabled = false, dispatch, modularName } = this.props;
    const { getFieldDecorator } = form;

    return (
      <div>
        <Form layout='vertical'>
          <Row gutter={16} type='flex'>
            <Col span={24}>
              <div style={{ marginBottom: 16 }}>
                <div style={{ display: 'inline-block', verticalAlign: 'top', minWidth: 70, textAlign: 'right', paddingRight: 12, lineHeight:'32px' }}>期数</div>
                <div style={{ display: 'inline-block', verticalAlign: 'top' }}>
                  {getFieldDecorator('qishu', {
                    rules: [{ required: true, message: '该项为必填项' }]
                  })(
                    <Input placeholder='请输入期数' disabled={disabled} style={{ width: 300 }} />
                  )}
                </div>
              </div>
            </Col>
          </Row>
        </Form>
        <List
          mode='select'
          style={{ backgroundColor: '#fff' }}
          rowSelection={{
            onChange: (selectedRowKeys, rows) => {
              dispatch({
                type: `${modularName}/changeState`,
                payload: {
                  selectedEvents: [...selectedEvents.filter(item => selectedRowKeys.includes(item.id) && !rows.map(row => row.id).includes(item.id)), ...rows]
                }
              });
            }
          }}
        />
      </div>
    );
  }
}
